/*

@description: 寄件服务JavaScript

@author: 赖赖

@update: 2021年9月8日15:56:25

*/


// 获取按钮
const but = document.querySelector('.jz');
// 条款复选框
const fxk = document.querySelector('.fxk')

// 获取所有输入框节点
const j_name = document.querySelector('.j_name');
const j_phone = document.querySelector('.j_phone');
const j_address = document.querySelector('.j_address')
const s_name = document.querySelector('.s_name');
const s_phone = document.querySelector('.s_phone');
const s_address = document.querySelector('.s_address');

// 上门时间
const sm_time = document.querySelector('.sj');

// 验证码相关获取
const vcode = document.getElementById('vcode');
const yzm = vcode.value;
const yzm_ts = document.querySelector('.yzm_ts');

// 模态框
const mtk = document.querySelector(".mtk")
// 关闭按钮
const gb = document.querySelector(".gb")
// 我已理解并同意遵守服务条款
const tk = document.querySelector('.tk')

// 表单验证
function getPanduan() {
  const reg_phone = /^(1[3-9])\d{9}$/;// 手机号判断正则

  // 获取提示框 用于样式
  const ts = document.querySelectorAll('.ts');
  const dz_ts = document.querySelectorAll('.dz_ts');
  const set_out = document.querySelector('.set_out');
  const time = document.querySelector('.sj');

  // 寄件人姓名验证
  if (j_name.value.length < 1) {
    ts[0].style.opacity = '1';
  } else { ts[0].style.opacity = '0'; }
  
  // 寄件人电话验证
  if (!reg_phone.test(j_phone.value)) {
    ts[1].style.opacity = '1';
  } else { ts[1].style.opacity = '0'; }
  
  // 收件人姓名验证
  if (s_name.value.length < 1) {
    ts[2].style.opacity = '1';
  } else { ts[2].style.opacity = '0'; }
  
  // 收件人电话验证
  if (!reg_phone.test(s_phone.value)) {
    ts[3].style.opacity = '1';
  } else { ts[3].style.opacity = '0'; }
  
  // 寄件人地址验证
  if (j_address.value.length < 1) {
    dz_ts[0].style.opacity = '1';
  } else { dz_ts[0].style.opacity = '0'; }
  
  // 收件人地址验证
  if (s_address.value.length < 1) {
    dz_ts[1].style.opacity = '1';
  } else { dz_ts[1].style.opacity = '0'; }
  
  // 上门时间验证
  if (time.value.length < 1) {
    set_out.style.opacity = '1';
  } else { set_out.style.opacity = '0'; }
  
  
  // 验证码信息验证
  if (vcode.value < 1) {
    yzm_ts.innerHTML = '请输入验证码!';
  } else { yzm_ts.innerHTML = ' '; }
  
  if (vcode.value.toLocaleLowerCase() !== code.toLocaleLowerCase()) {
    yzm_ts.innerHTML = '输入正确的验证码!';
    changeImg();// 刷新验证码
  } else { yzm_ts.innerHTML = ' '; }
  
  if (vcode.value.toLocaleLowerCase() === code.toLocaleLowerCase()) {
    getitj(); // 提交数据到后端
  }
}

// 时间限制
//input date 限制选择的时间，只能选择之后的时间
$(function () {
  //得到明天时间
  const t = new Date(new Date().getTime() + 86400000);
  //得到当前年份
  var year = t.getFullYear();
  //得到当前月份
  //注：
  //  1：js中获取Date中的month时，会比当前月份少一个月，所以这里需要先加一
  //  2: 判断当前月份是否小于10，如果小于，那么就在月份的前面加一个 '0' ， 如果大于，就显示当前月份
  var month = t.getMonth() + 1 < 10 ? "0" + (t.getMonth() + 1) : (t.getMonth() + 1);
  
  // 明天多少号
  
  const torr = t.getDate() < 10 ? "0" + t.getDate() : t.getDate();
  
  //设置input标签的min属性 从明天选择之后的日期，max最大，只能选择之前的日期
  $("#time").attr("min", year + "-" + month + "-" + torr);
})


// 传输数据到后端
function getitj() {
  $.ajax({
    url: 'http://127.0.0.1:7001/api/mail',
    method: 'post',
    data: {
      name_mail: j_name.value,
      phone_mail: j_phone.value,
      address_mail: j_address.value,
      jname_mail: s_name.value,
      jphone_mail: s_phone.value,
      jaddress_mail: s_address.value,
      time_mail: sm_time.value,
    },
    success(res) {
      console.log(res.result1);   
      // console.log(res.result[0].order_mail);   
      // console.log(res.result[0].MAX());   
      // console.log('发送成功');
      if(res.result1 === undefined) {
        alert('请输入相关信息！')
      } else {
        alert(`您好！您的单号为：${res.result1}`)
        window.location.reload();//刷新页面
      }
      if(code === 4006) {
        alert('提交失败！请核实信息！')
      }      
    },
    error() {
      console.log('发送失败');
    },
  });
}

// 点击提交出发按钮
but.onclick = function () {
  getPanduan(); // 判断数据是否正确
};

// 是否同意条款
fxk.onclick = function () { 
 // 条款验证
 if(fxk.checked === true){
   but.classList.remove('jz')
   but.classList.add('tj_an')
   but.disabled = false
 }else{
  but.classList.remove('tj_an')
  but.classList.add('jz')
  but.disabled = true
 }
}

// 验证码
let code; // 声明一个变量用于存储生成的验证码
const codes = document.getElementById('code');
changeImg();
codes.onclick = changeImg;
function changeImg() {
  const arr = new Array(
    '1', '2', '3', '4', '5', '6', '7', '8', '9', '0',
    'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j',
    'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't',
    'u', 'v', 'w', 'x', 'y', 'z',
    'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J',
    'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T',
    'U', 'V', 'W', 'X', 'Y', 'Z');
  code = '';
  for (i = 0; i < 4; i++) {
    // 随机生成四位数验证码
    const r = parseInt(Math.random() * arr.length);
    code += arr[r];
  }
  document.getElementById('code').innerHTML = code;
  // console.log(code);
}

// 模态框条款
const tknr = document.querySelector('.tknr')

// 读取文档
function getk() {
  $.ajax({
    url: `http://127.0.0.1:7001/api/agreement`,
    method: 'get',
    success: function (res) {
      tknr.innerHTML = `${res.data[0].agr_content}`
    }
  })
}
getk()



// 关闭按钮被点击
gb.onclick = function () {
  mtk.style.display = 'none'
}
// 条款被点击
tk.onclick = function () {
  mtk.style.display = 'block'
}

